<template>
  <FormBase
    class="al-form"
    ref="alFormRef"
    :formData="formData || {}"
    @formEvent="formEvent"
    v-bind="formConfig"
  ></FormBase>
  <el-button type="" @click="alFormRef.getFormItemRef('fieldCode')">sadkjka</el-button>
</template>
<script setup>
import FormBase from '@/components/form/FormBase.vue';

function formEvent(e) {
  console.log(e);
}

const formData = ref({});
const alFormRef = ref();

const formConfig = {
  formList: [
    {
      prop: 'fieldCode',
      label: 'Code',
      component: 'input',
      itemConfig: {
        rules: [{ required: true }],
      },
    },
    {
      prop: 'no',
      label: 'No.',
      itemConfig: {
        col: { span: 24 },
      },
    },
    {
      prop: 'userName',
      label: 'Submit User',
      itemConfig: {},
      bindConfig: {
        showTooltip: true,
      },
    },
    {
      prop: 'submitDate',
      label: 'Submit Date',
      itemConfig: {
        class: 'form-item-block-all-20',
      },
      bindConfig: {
        // formatter: dateFormatter(),
      },
    },
  ],
  formConfig: {
    labelPosition: 'left',
    labelWidth: '120px',
    itemConfig: { style: { marginRight: '10px', marginBottom: 0 } },
    isColon: true,
    col: { span: 12 },
    inline: true,
  },
};

const props = defineProps({});
const emit = defineEmits([]);
const init = () => {};
</script>
<style lang="scss" scoped></style>
